<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<div id="dataset" style="height: 400px"></div>
	<script src="echarts4.js"></script>
	<script>
        //light  dark 无效
		var myChart=echarts.init(document.querySelector('#dataset'),'dark');
     
     	var option={
               legend:{},
               tooltip:{},
               // dataset:{
               //      source: [
               //             ['product', '2015', '2016', '2017'],
               //             ['Matcha Latte', 43.3, 85.8, 93.7],
               //             ['Milk Tea', 83.1, 73.4, 55.1],
               //             ['Cheese Cocoa', 86.4, 65.2, 82.5],
               //             ['Walnut Brownie', 72.4, 53.9, 39.1]
               //         ]
               // },
               dataset:{
                    dimensions:['product', '2015', '2016', '2017'],
                    source:[//每一个是 item1 item2 item3
                           {product: 'Matcha Latte', '2015': 1, '2016': 2, '2017': 3},
                           {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},
                           {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},
                           {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}
                       ]
               },
               xAxis:{
                    type:'category'
               },
               yAxis:{},
               series:[
                    {
                         type:'bar',seriesLayoutBy:'row'
                    }, {
                         type:'bar',seriesLayoutBy:'row'
                    }, {
                         type:'bar',seriesLayoutBy:'row'
                    }
               ]
          }
        myChart.setOption(option)
	</script>
</body>
</html>